<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
request.setAttribute("basePath", basePath);
%>
    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico"/>
<link rel="stylesheet" type="text/css" href="${basePath}/css/default/om-default.css" />
<link rel="stylesheet" href="${basePath}/css/base.css" />
<link rel="stylesheet" href="${basePath}/css/meroperation.css" />
<link rel="stylesheet" type="text/css" href="${basePath}/css/grid-extra.css" />
<script type="text/javascript" src="${basePath}/js/jquery.min.js" charset="utf-8"></script>
<script type="text/javascript" src="${basePath}/js/operamasks-ui.min.js" charset="utf-8"></script>
<script type="text/javascript" src="${basePath}/js/om-grid.js" charset="utf-8"></script>
<script type="text/javascript" src="${basePath}/js/om-calendar.js" charset="utf-8"></script>
<script type="text/javascript" src="${basePath}/js/util.js"></script>
<script type="text/javascript" src="${basePath}/js/tools.js" charset="utf-8"></script>
<title>Insert title here</title>
<script type="text/javascript">
	
	var user;
$(function(){
	
	var rolestr = $('#roles').val();
	user = JSON.parse($('#user').val() )
	var roleIds =eval('['+user.roleIds+']');
	var roles =JSON.parse(rolestr);
	var roleTrs = []
	$.each(roles , function(i , item ){
		if($.inArray(item.id , roleIds)>-1)
		{
			roleTrs.push("<tr>"+
		    		"<td>"+
	    			"<input class=\"role\" name=\"role\" type=\"checkbox\" value=\""+item.id +"\" checked=\"checked\" />"+item.description+
	    		"</td>"+
	    	   "</tr>");
		}else{
			roleTrs.push("<tr>"+
		    		"<td>"+
	    			"<input class=\"role\" name=\"role\" type=\"checkbox\" value=\""+item.id +"\"/>"+item.description+
	    		"</td>"+
	    	   "</tr>");
		}
	});
	
   	var roleTmp = roleTrs.join("  ");
	$('#roleTable').append(roleTmp);
	
})

function roleAdd()
{
	var par = new Object();
	par.id = user.id;
	var roleIds='';
	$('.role:checked').each(function(index){
			roleIds+=  $(this).val()+",";
	});
	par.roleIds = roleIds;
	$.ajax({
		type: "POST",
        url: "${basePath}/privilege/user/userAuthorization.do",
        data: par,
        dataType: "json",
        success: function(data){
        	if(data.success)
        	{
        		alert("授权成功");	
        	}else{
        		alert(data.message);
        	}
        }
	});
}

	
</script>

	<style type="text/css">
		.role{ width: 50px}!important
	</style>

</head>
<body>
		<div class='ui-nav fn-clear pl15'>
		    <div class='fn-left ft-14 pt5'><strong>权限管理    > 用户授权</strong></div>
		</div>
		<div class='ui-box-container'>
				<form id='selectForm' method="post" style="margin-top: 30px;margin-left: 30px">
				    <table class='ui-search-item' id="roleTable">
				    	<tr>
				    		<td>
				    			<input type="hidden" id="user"  name="user" value='${user}'/>
				    			<input type="hidden" id="roles"  name="roles" value='${roles}'/>
				    		</td>
				    	</tr>
				    </table>
				   <button id='button' type='button' class='iconrept btn ml3' onclick="roleAdd()" style="margin-left: 80px;margin-top: 80px">
		             				<span></span>保存
		           </button>
		</div>
</body>
</html>